import callFeedback from "@/components/common/modalFeedback";
import { CATEGORY } from "@/components/pages/wheel";
import { API, BASE_PATH } from "@/config";
import requewt from "@/utils/requewt";
import { Button, Grid, Modal } from "antd-mobile";
import React, { useEffect, useMemo, useState } from "react";
const ModalAction = ({item, handler,m}) => {
  const [popShare, setPopShare] = useState(false)
  const columns = useMemo(() => {
    return popShare ? 2 : 1
  }, [popShare])
  // useEffect(() => {
  //   if ([3,0,4].includes(item.category)) {
  //     requewt(API.user.userNeedShare).then((resp) => {
  //       console.log(resp,'resp')
  //       setPopShare(resp.data?.pop_share)
  //     })
  //   }
    
  // },[])
  return (
    [
      [3,0,4].includes(item.category)? <Grid key={1} columns={columns} gap={20}>
        <Grid.Item><Button key={`prize`} onClick={e => {
        // m.close()
        Modal.clear()
        setTimeout(()=> {
          if (item.pop_share) {
            handler.showShareModal()
          }
        },300)
        // console.log(handler)
        // handler.prize()
      }} size={`small`} shape={`rounded`}
      className="act-btn act-btn-bevel">确定</Button></Grid.Item>
        {
          popShare&&<Grid.Item><Button key={`prize`} onClick={e => {
            // m.close()
    
            // console.log(handler)
            Modal.clear()
            handler.showShareModal()
          }} size={`small`} shape={`rounded`}
          className="act-btn act-btn-bevel">分享抽奖</Button></Grid.Item>
        }
      </Grid>: <Button key={`cancel`} onClick={e => {
        Modal.clear()
        if (item.pop_share) {
          handler.showShareModal()
        }
      }} size={`small`} shape={`rounded`}
      className="act-btn act-btn-bevel">确认</Button>
      
    ]
  )
}
export default function FeedbackComp({item, actions, handler,onClose}) {
  console.log(item,'itemmmm')
  // const bottomAction = 
  const m = callFeedback({
    hideClose:true,
    bodyClassName: `price-result-modal`,
    // header: <>{CATEGORY[item?.category]?.feedback}</>,
    // title: <img src={item.draw_icon} width='92' alt="" className="thumb-title" />,
    content: <div className="inner">
      <div className={[0,1,2,3,4].includes(item.category) ? 'prize-content': ''}>
        {/* <img 
          className="prize-happy"
          src={`${BASE_PATH}/img/prize/prize-happy-bg.png`}
        /> */}
      <div className="header">
        {CATEGORY[item?.category]?.feedback}
      </div>
      <div className="thumb">
        <img 
          src={item.icon}
        />
      </div>
      <div>
        {item.name}
      </div>
      </div>
    </div>,
    actions: actions || <ModalAction  item={item} handler={handler} />,
    onClose() {
      onClose()
    },
    closeOnAction: false,
    closeOnMaskClick: false,
  })

  return m
}